<%@ page import="com.wuda.bean.User" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="../../js/layui/css/layui.css">
    <script src="../../js/jquery-3.4.1.js"></script>
    <script src="../../js/layui/layui.all.js"></script>
    <style>
        .login-container {
            width: 400px;
            margin: 100px auto;
            padding: 20px;
            border: 1px solid #e2e2e2;
            border-radius: 5px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }

        .login-container h2 {
            text-align: center;
            margin-bottom: 20px;
        }

        .login-container .layui-form-item {
            margin-bottom: 15px;
        }

        .login-container .layui-form-item .layui-input-block {
            margin-left: 0;
        }

        .login-container .layui-form-item .layui-form-label {
            width: auto;
        }

        .login-container .register-link {
            text-align: right;
            margin-top: 10px;
        }
    </style>
</head>
<body>
<div class="login-container">
    <h2>登录</h2>
    <form class="layui-form" id="loginForm">
        <div class="layui-form-item">
            <label class="layui-form-label">邮箱</label>
            <div class="layui-input-block">
                <input type="email" name="email" required lay-verify="email" placeholder="请输入邮箱"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码</label>
            <div class="layui-input-block">
                <input type="password" name="password" required lay-verify="required" placeholder="请输入密码"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="login" id="loginBtn">登录</button>
            </div>
        </div>
        <div class="register-link">
            <a href="./enroll.jsp" target="view_frame">注册</a>
        </div>
    </form>
</div>
<script>

    $(document).ready(function () {
        // 模拟检查是否已登录
        let user = JSON.parse(sessionStorage.getItem('user'));

        // 登录按钮防止重复点击
        let loginBtn = $('#loginBtn');
        loginBtn.prop('disabled', false);

        layui.form.on('submit(login)', function (data) {
            if (!loginBtn.prop('disabled')) {
                loginBtn.prop('disabled', true);
                setTimeout(function () {
                    loginBtn.prop('disabled', false);
                }, 5000);


                // 模拟登录接口
                $.ajax({
                    type: 'POST',
                    url: '/login',  // 假设这是你的登录接口
                    data: {
                        email: data.field.email,
                        password: data.field.password
                    },
                    success: function (response) {
                        if (response.code === 200) {
                            layer.msg("登录成功", {
                                icon: 6,
                                time: 1000
                            }, function () {
                                // 登录成功后，刷新整个页面
                                window.top.location.href = '<%= request.getContextPath() %>/index.jsp'; // 使用 window.top 进行跳转
                            })
                        } else {
                            layui.layer.msg(response.msg, {icon: 2});
                        }
                    }
                });
            }
            return false;
        });
    });

</script>
</body>
</html>
